import React from 'react';
import { DivFlex, DivFlexCenter, DivFlexColumn } from '@/styles/div-css/index';
import './index.scss';

//logo组件
// const logUrl = "https://www.muyuanfoods.com/img/logo.b46a7e56.png";
const logUrl = '';

const LeftComponent = () => (
  <div className="company-left">
    <img src={logUrl} alt="" />
    <p className="company-name">
      集团股份有限公司&nbsp;&nbsp;&nbsp;©&nbsp;1993-2024&nbsp;&nbsp;dbn.com.cn&nbsp;&nbsp;&nbsp;All
      Rights Reserved
    </p>
    <p>
      <span className="jinBeian">京ICP备10214882号</span>
    </p>
  </div>
);

const QR_ARR = [
  {
    url: 'https://www.dbn.com.cn/static/portal/img/footer_yzzs.03b78293.png',
    label: '助手'
  },
  {
    url: 'https://www.dbn.com.cn/static/portal/img/footer_dbn.65f6c5f3.png',
    label: '微信'
  }
];
const RightComponent = () => (
  <DivFlexCenter width="10%">
    {QR_ARR.map((item, index) => {
      return (
        <li key={index} className="li-qr">
          <img src={item.url} alt="" />
          <span>{item.label}</span>
        </li>
      );
    })}
  </DivFlexCenter>
);

export default function PublicFooter() {
  return (
    <DivFlexCenter $bgColor="#000" height="184px" className="public-footer">
      <DivFlexCenter width="65%">
        <LeftComponent />
        <RightComponent />
      </DivFlexCenter>
    </DivFlexCenter>
  );
}
